﻿@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>职级管理</title>
    <link href="~/scripts/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
    <style>
        .layui-form { padding: 20px; }
        .layui-form-item .layui-inline { margin-bottom: 5px; margin-right: 0; }
        /* 自动生成开关样式 */
        .auto-generate-switch { display: inline-block; margin-left: 10px; }
        .layui-disabled { background-color: #f5f5f5; }
    </style>
</head>
<body>
    <form class="layui-form" action="javascript:void(0);">
        @Html.AntiForgeryToken()
        <div class="layui-form-item">
            <div class="layui-inline" style="width: 100%;">
                <label class="layui-form-label"><span style="color: red;">*</span>职级编码</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <input type="text" id="jobGradeCoding" name="JobGradeCoding" placeholder="请输入职级编码" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-input-inline auto-generate-switch">
                    <input type="checkbox" name="autoGenerateJobGradeCoding" lay-skin="switch" lay-text="自动生成|手动输入" lay-filter="autoGenerate" checked>
                </div>
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label"><span style="color: red;">*</span>职级层次</label>
            <div class="layui-input-inline">
                <input type="text" name="JobGradeLevel" lay-verify="required" placeholder="请输入职级层次" autocomplete="off" class="layui-input" >
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span style="color: red;">*</span>职级层次名称</label>
            <div class="layui-input-inline">
                <input type="text" name="JobGradeLevelName" lay-verify="required" placeholder="请输入职级层次名称" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span style="color: red;">*</span>备注</label>
            <div class="layui-input-inline">
                <input type="text" name="ReferenceColumn" lay-verify="required" placeholder="请输入备注" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span style="color: red;">*</span>薪资范围下限</label>
            <div class="layui-input-inline">
                <input type="number" name="SalaryRangelower" lay-verify="required|number" placeholder="请输入薪资范围下限" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span style="color: red;">*</span>薪资范围上限</label>
            <div class="layui-input-inline">
                <input type="number" name="SalaryRangelimits" lay-verify="required|number" placeholder="请输入薪资范围上限" autocomplete="off" class="layui-input">
            </div>
        </div>
        
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit lay-filter="jobGradeForm">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

    <script src="~/scripts/layui-v2.5.6/layui/layui.js"></script>
    <script>
        layui.use(['form', 'layer'], function(){
            var form = layui.form,
                layer = layui.layer,
                $ = layui.$;
            
            // 获取职级编码输入框和自动生成开关
            var jobGradeCodingInput = $('#jobGradeCoding');
            var autoGenerateSwitch = $('input[name="autoGenerateJobGradeCoding"]');

            // 生成职级编码
            function generateJobGradeCode() {
                var date = new Date();
                var year = date.getFullYear();
                var month = (date.getMonth() + 1).toString().padStart(2, '0');
                var day = date.getDate().toString().padStart(2, '0');
                var random = Math.floor(Math.random() * 9000 + 1000);
                return 'JG' + year + month + day + random;
            }

            // 更新职级编码输入框状态
            function updateJobGradeCodingState() {
                var isChecked = autoGenerateSwitch.prop('checked');
                if (isChecked) {
                    // 自动生成模式
                    var generatedCode = generateJobGradeCode();
                    jobGradeCodingInput.val(generatedCode);
                    jobGradeCodingInput.attr('disabled', true).addClass('layui-disabled');
                    jobGradeCodingInput.removeAttr('lay-verify');
                } else {
                    // 手动输入模式
                    jobGradeCodingInput.val('');
                    jobGradeCodingInput.removeAttr('disabled').removeClass('layui-disabled');
                    jobGradeCodingInput.attr('lay-verify', 'required');
                }
                form.render();
            }

            // 页面加载时初始化
            updateJobGradeCodingState();

            // 监听自动生成开关
            form.on('switch(autoGenerate)', function(data){
                updateJobGradeCodingState();
            });
            
            // 监听提交
            form.on('submit(jobGradeForm)', function(data){
                var field = data.field;
                
                // 构建提交数据
                var formData = {
                    JobGradeLevel: field.JobGradeLevel,
                    JobGradeLevelName: field.JobGradeLevelName,
                    ReferenceColumn: field.ReferenceColumn,
                    SalaryRangelower: parseInt(field.SalaryRangelower),
                    SalaryRangelimits: parseInt(field.SalaryRangelimits),
                    JobGradeCoding: jobGradeCodingInput.val() // 使用输入框的当前值
                };

                // 验证必填字段
                if (!formData.JobGradeLevel || !formData.JobGradeLevelName || !formData.ReferenceColumn) {
                    layer.msg('请填写所有必填字段', {icon: 2});
                    return false;
                }

                // 验证薪资范围
                if (!formData.SalaryRangelower || !formData.SalaryRangelimits) {
                    layer.msg('请输入薪资范围', {icon: 2});
                    return false;
                }

                if (formData.SalaryRangelower >= formData.SalaryRangelimits) {
                    layer.msg('薪资范围上限必须大于下限', {icon: 2});
                    return false;
                }

                var loadIndex = layer.load(1);
                
                // 获取防伪标记
                var token = $('input[name="__RequestVerificationToken"]').val();
                
                $.ajax({
                    url: '/JobGradeManagement/AddJobGradeManage',
                    type: 'POST',
                    contentType: 'application/json',
                    data: JSON.stringify(formData),
                    headers: {
                        'RequestVerificationToken': token
                    },
                    success: function(res) {
                        layer.close(loadIndex);
                        if(res.success) {
                            layer.msg('添加成功', {
                                icon: 1,
                                time: 1500
                            }, function(){
                                // 直接调用父页面的刷新方法
                                if (window.parent && window.parent.location) {
                                    try {
                                        // 先刷新父页面
                                        window.parent.location.reload();
                                        // 延迟关闭当前页面
                                        setTimeout(function() {
                                            var index = parent.layer.getFrameIndex(window.name);
                                            parent.layer.close(index);
                                        }, 100);
                                    } catch (e) {
                                        console.error('关闭页面时出错:', e);
                                        // 如果出错，至少刷新父页面
                                        window.parent.location.reload();
                                    }
                                }
                            });
                        } else {
                            layer.msg(res.message || '添加失败', {icon: 2});
                        }
                    },
                    error: function(xhr, status, error) {
                        layer.close(loadIndex);
                        console.error('Error:', xhr.responseText);
                        var errorMessage = '服务器错误';
                        try {
                            if (xhr.responseText) {
                                var response = JSON.parse(xhr.responseText);
                                errorMessage = response.message || response.error || '添加失败';
                            }
                        } catch (e) {
                            console.error('解析错误信息失败:', e);
                            errorMessage = '提交失败，请检查输入数据';
                        }
                        layer.msg(errorMessage, {icon: 2});
                    }
                });
                
                return false;
            });
        });
    </script>
</body>
</html>
